import React, { Component } from 'react';
import { Button, Row, Col, } from 'antd';
import { Link } from 'react-router';
import './Rdb.less';

export default class Rdb extends Component {
  onChange(index) {
    // console.log(index);
  }

  render() {
    return (
      <div className="block-rdb">
        <Row className="row-slogan">
          <Col span={24}>
            <img src={ require('./../img/banner/2.png') } alt="banner" />
            <article>
              <h3>关系型数据库</h3>
              <span>xxxx</span>
              <p>
                <Button size="large" type="primary">立即购买</Button>
                <Button size="large" ghost>管理控制台</Button>
                <Link to='/price/rdb'><Button size="large" ghost>定价总览</Button></Link>
              </p>
            </article>
          </Col>
        </Row>

        <div className="wrap-goodness">
          <Row>
            <Col span={6}>
              <i className="icon icon-goodness1"></i>
              <h6>易用性</h6>
              <p>简单易用，便于管理<br/>深度集成数据处理服务</p>
            </Col>
            <Col span={6}>
              <i className="icon icon-goodness2"></i>
              <h6>高可靠</h6>
              <p>多重冗余备份<br/>服务设计可用性不低于99.99%</p>
            </Col>
            <Col span={6}>
              <i className="icon icon-goodness3"></i>
              <h6>强安全</h6>
              <p>多层次安全防护<br/>支持跨区域复制、异地容灾机制</p>
            </Col>
            <Col span={6}>
              <i className="icon icon-goodness4"></i>
              <h6>低成本</h6>
              <p>总体TCO更低<br/>生命周期管理进一步降低成本</p>
            </Col>
          </Row>
        </div>

        <div className="wrap-feature">
          <Row className="row-title">
            <Col span={24}>
              <h5>产品功能</h5>
            </Col>
          </Row>
          <Row className="row-feature">
            <Col span={24}>
              <i className="icon icon-feature1"></i>
              <p><strong>方便、灵活的使用方式，让您像操作本地文件一样</strong>访问灵活<br/>提供标准的RESTful API接口，丰富的SDK包，客户端工具、控制台，您可以像使用文件一样，方便上传/下载、检索、管理用于Web网站或者移动应用海量的数据。<br/><br/>支持数据生命周期管理<br/>您可以设置存储对象的生命周期，按指定的时间计划系统会自动执行批量删除或存储类型的转换的任务。</p>
            </Col>
          </Row>
          <Row className="row-feature">
            <Col span={24}>
              <i className="icon icon-feature2"></i>
              <p><strong>流式写入和读取，支持边读边写</strong>适用视频监控存储、提供类文件读写接口<br/>使摄像机的视频码流能像“流”一样往对象（文件）后面追加新内容，且已上传的内容即使在该对象（文件）未写完时都可以被访问，真正实现文件流式存储，视频录像秒级回放。<br/><br/>提供设备端直连OSS的C语言SDK开发包和Demo<br/>加快您的开发速度，节省开发成本</p>
            </Col>
          </Row>
          <Row className="row-feature">
            <Col span={24}>
              <i className="icon icon-feature3"></i>
              <p><strong>强大、灵活的安全机制</strong>灵活的鉴权，授权机制；提供STS和URL鉴权和授权机制，及白名单，防盗链，主子账号功能；<br/>提供跨区域复制功能；实现数据异地容灾</p>
            </Col>
          </Row>
          <Row className="row-feature">
            <Col span={24}>
              <i className="icon icon-feature4"></i>
              <p><strong>强大的数据处理能力</strong>图片处理；支持jpg, png, bmp, gif, webp, tiff等多种图片格式的文件格式转换、缩略图、剪裁、水印、缩放等多种操作<br/>音视频转码；基于OSS存储，为您提供高质量，高速并行音视频转码能力，让您的音视频文件轻松应对各种终端设备<br/>内容加速分发；OSS作为源站，搭配CDN进行加速分发，稳定、无回源带宽限制、性价比高，一键配置</p>
            </Col>
          </Row>
          <Row className="row-feature">
            <Col span={24}>
              <i className="icon icon-feature5"></i>
              <p><strong>不断丰富的行业解决方案产品包</strong>安防监控行业，在线点播，交互式直播，图片处理与存储等</p>
            </Col>
          </Row>
        </div>
      </div>
    )
  }
}